<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>事件冒泡</title>
    <script>
        function clickDiv() {
            console.log("正在点击div")
            location.href = "28-来抓我呀.html";
        }

        function clickA() {
            console.log("正在点击超链接")
            document.getElementById("d1").style.display = "none";
            // 老版本
            // 通过事件对象Event来处理事件冒泡
            // cancelBubble:设置或返回事件是否不应该向上层级进行传播。
            // event.cancelBubble = true;
            // 新版本
            // 阻止事件冒泡
            event.stopPropagation();
        }
    </script>
</head>
<body>
<div id="d1" style="width: 200px;height: 100px;background-color: red;" onclick="clickDiv()">
    <a href="javascript:;" onclick="clickA()">X</a>
</div>
</body>
</html>